﻿@model ScadaWeb.Web.Areas.Scada.Models.WebDesignerModel
@{
    ViewBag.Title = "WebDesigner";
    Layout = "~/Views/Shared/_LayoutWebDesign.cshtml";
}


<div class="navbar navbar-default navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">

        <div class="pull-left">
            <ul class="nav navbar-nav">
                <li>

                    <a data-target="#LoadPage" role="button" data-toggle="modal"><i class="icon-folder-open icon-white"></i>打开</a>

                </li>
                <li>
                    <a data-target="#newPage" role="button" data-toggle="modal"><i class="icon-pencil icon-white"></i>新建</a>

                </li>
                <li>
                    <a data-target="#downloadModal" role="button" data-toggle="modal"><i class="icon-chevron-down icon-white"></i>HTML</a>

                </li>
                <li>
                    <a href="#" id="jsfile" data-target="#JsContent" role="button" data-toggle="modal"><i class="icon-edit icon-white"></i>页面脚本</a>
                </li>


                <li>
                    <a href="#" id="save"><i class="icon-folder-close icon-white"></i>保存</a>
                </li>
                <li>     <a href="#" id="edit"><i class="icon-edit icon-white"></i>编辑</a></li>
                <li>   <a href="#" id="devpreview"><i class="icon-eye-close icon-white"></i>布局编辑</a></li>
                <li>  <a href="#" id="sourcepreview"><i class="icon-eye-open icon-white"></i>非编辑模式</a></li>
                <li>
                    <a href="#" id="pagepreview"><i class="icon-eye-open icon-white"></i>预览页面</a>
                </li>
                <li> <a href="#undo" id="undo"><i class="icon-arrow-left icon-white"></i>撤销</a></li>
                <li>        <a href="#redo" id="redo"><i class="icon-arrow-right icon-white"></i>重做</a></li>
                <li>    <a href="#clear" id="clear"><i class="icon-trash icon-white"></i>清空</a></li>

                <li>
                    <a href="#" id="save"><i class="icon-folder-close icon-white"></i>保存</a>
                </li>




            </ul>
        </div>
        <div class="pull-right">
            <label id="pageTitle" style="font-size:20px;color:#fff"></label>
        </div>
    </div>
</div>


<div class="container">
    <div class="row">
        <div class="">
            <div class="sidebar-nav" style="scroll-behavior:smooth; overflow:scroll;">

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">

                        <i class="glyphicon-plus glyphicon"></i>
                        布局设置
                    </li>
                    <li class="rows" id="estRows">

                        <div class="lyrow">
                            <a href="#close" class="remove label label-danger">
                                <i class=" "></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">
                                <input type="text" value="12" class="form-control">
                            </div>
                            <div class="view">
                                <div class="row clearfix">
                                    <div class="col-md-12 column"></div>
                                </div>
                            </div>
                        </div>

                        <div class="lyrow">
                            <a href="#close" class="remove label label-danger">
                                <i class=" "></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">
                                <input type="text" value="6 6" class="form-control">
                            </div>
                            <div class="view">
                                <div class="row clearfix">
                                    <div class="col-md-6 column"></div>
                                    <div class="col-md-6 column"></div>
                                </div>
                            </div>
                        </div>

                        <div class="lyrow">
                            <a href="#close" class="remove label label-danger">
                                <i class=" "></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">
                                <input type="text" value="8 4" class="form-control">
                            </div>
                            <div class="view">
                                <div class="row clearfix">
                                    <div class="col-md-8 column"></div>
                                    <div class="col-md-4 column"></div>
                                </div>
                            </div>
                        </div>

                        <div class="lyrow">
                            <a href="#close" class="remove label label-danger">
                                <i class=" "></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">
                                <input type="text" value="4 4 4" class="form-control">
                            </div>
                            <div class="view">
                                <div class="row clearfix">
                                    <div class="col-md-4 column"></div>
                                    <div class="col-md-4 column"></div>
                                    <div class="col-md-4 column"></div>
                                </div>
                            </div>
                        </div>

                        <div class="lyrow">
                            <a href="#close" class="remove label label-danger">
                                <i class=" "></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">
                                <input type="text" value="2 6 4" class="form-control">
                            </div>
                            <div class="view">
                                <div class="row clearfix">
                                    <div class="col-md-2 column"></div>
                                    <div class="col-md-6 column"></div>
                                    <div class="col-md-4 column"></div>
                                </div>
                            </div>
                        </div>

                    </li>
                </ul>

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">
                        <i class="glyphicon glyphicon-plus"></i>
                        基本CSS

                    <li class="boxes" id="elmBase">
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>

                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        对齐
                                        <span class="caret"></span>

                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-left">靠左</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-center">居中</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-right">靠右</a>
                                        </li>
                                    </ul>
                                </span>
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        标记
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="muted">禁用</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-warning">警告</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-error">错误</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-info">提示</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-success">成功</a>
                                        </li>
                                    </ul>
                                </span>
                            </span>
                            <div class="preview">标题栏</div>
                            <div class="view">
                                <h3 contenteditable="true">h3. 这是一套可视化布局系统.</h3>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        对齐
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-left">靠左</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-center">居中</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-right">靠右</a>
                                        </li>
                                    </ul>
                                </span>
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        标记
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="muted">禁用</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-warning">警告</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-error">错误</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-info">提示</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="text-success">成功</a>
                                        </li>
                                    </ul>
                                </span>

                                <a class="btn btn-xs btn-default" href="#" rel="lead">Lead</a>
                            </span>
                            <div class="preview">段落</div>
                            <div class="view">
                                <div class="col-md-12 column">

                                    <p>
                                        <em>Git</em>
                                        是一个分布式的版本控制系统，最初由 <strong>Linus Torvalds</strong>
                                        编写，用作Linux内核代码的管理。在推出后，Git在其它项目中也取得了很大成功，尤其是在
                                        <small>Ruby</small>
                                        社区中。
                                    </p>
                                </div>

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">地址</div>
                            <div class="view">
                                <div class="col-md-12 column">
                                    <address contenteditable="true">
                                        <strong>Twitter, Inc.</strong>
                                        <br>
                                        795 Folsom Ave, Suite 600
                                        <br>
                                        San Francisco, CA 94107
                                        <br> <abbr title="Phone">P:</abbr>
                                        (123) 456-7890
                                    </address>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="pull-right">Pull right</a>
                            </span>
                            <div class="preview">引用块</div>
                            <div class="view clearfix">
                                <div class="col-md-12 column">
                                    <blockquote contenteditable="true">
                                        <p>
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
                                        </p>
                                        <small>
                                            Someone famous
                                            <cite title="Source Title">Source Title</cite>
                                        </small>
                                    </blockquote>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="list-unstyled">无样式</a>
                                <a class="btn btn-xs btn-default" href="#" rel="list-inline">嵌入</a>
                            </span>
                            <div class="preview">无序列表</div>
                            <div class="view">
                                <div class="col-md-12 column">
                                    <ul contenteditable="true">
                                        <li>Lorem ipsum dolor sit amet</li>
                                        <li>Consectetur adipiscing elit</li>
                                        <li>Integer molestie lorem at massa</li>
                                        <li>Facilisis in pretium nisl aliquet</li>
                                        <li>Nulla volutpat aliquam velit</li>
                                        <li>Faucibus porta lacus fringilla vel</li>
                                        <li>Aenean sit amet erat nunc</li>
                                        <li>Eget porttitor lorem</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="list-unstyled">无样式</a>
                                <a class="btn btn-xs btn-default" href="#" rel="list-inline">嵌入</a>
                            </span>
                            <div class="preview">有序列表</div>
                            <div class="view">
                                <div class="col-md-12 column">
                                    <ol contenteditable="true">
                                        <li>Lorem ipsum dolor sit amet</li>
                                        <li>Consectetur adipiscing elit</li>
                                        <li>Integer molestie lorem at massa</li>
                                        <li>Facilisis in pretium nisl aliquet</li>
                                        <li>Nulla volutpat aliquam velit</li>
                                        <li>Faucibus porta lacus fringilla vel</li>
                                        <li>Aenean sit amet erat nunc</li>
                                        <li>Eget porttitor lorem</li>
                                    </ol>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="dl-horizontal">竖向对齐</a>
                            </span>
                            <div class="preview">详细描述</div>
                            <div class="view">
                                <div class="col-md-12 column">
                                    <dl contenteditable="true">
                                        <dt>Description lists</dt>
                                        <dd>A description list is perfect for defining terms.</dd>
                                        <dt>Euismod</dt>
                                        <dd>
                                            Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
                                        </dd>
                                        <dd>Donec id elit non mi porta gravida at eget metus.</dd>
                                        <dt>Malesuada porta</dt>
                                        <dd>Etiam porta sem malesuada magna mollis euismod.</dd>
                                        <dt>Felis euismod semper eget lacinia</dt>
                                        <dd>
                                            Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                        </div>



                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="img-rounded">圆角</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="img-circle">圆圈</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="img-thumbnail">相框</a>
                                        </li>
                                    </ul>
                                </span>
                            </span>
                            <div class="preview">图片</div>
                            <div class="view">
                                <img alt="140x140" src="~/Content/img/a.jpg">
                            </div>
                        </div>
                    </li>
                </ul>

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">
                        <i class="glyphicon glyphicon-plus"></i>
                        工具组件

                    </li>
                    <li class="boxes" id="elmComponents">
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        尺寸
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-lg">大</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-md">中</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-sm">小</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-xs">微型</a>
                                        </li>
                                    </ul>
                                </span>
                                <a class="btn btn-xs btn-default" href="#" rel="btn-group-vertical">竖向</a>
                            </span>
                            <div class="preview">基本pills</div>
                            <div class="view">

                                <ul class="nav nav-pills">
                                    <li class="active">
                                        <a href="#">首页</a>
                                    </li>
                                    <li><a href="#">企业介绍</a></li>
                                    <li><a href="#">企业产品</a></li>
                                    <li><a href="#">企业文化</a></li>
                                    <li><a href="#">关于我们</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        尺寸
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-lg">大</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-md">中</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-sm">小</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-group-xs">微型</a>
                                        </li>
                                    </ul>
                                </span>
                                <a class="btn btn-xs btn-default" href="#" rel="btn-group-vertical">竖向</a>
                            </span>
                            <div class="preview">按钮组</div>
                            <div class="view">

                                <div class="btn-group col-md-12 column">
                                    <button class="btn btn-default" type="button">
                                        <i class="glyphicon glyphicon-align-left"></i>
                                        左
                                    </button>
                                    <button class="btn btn-default" type="button">
                                        <i class="glyphicon glyphicon-align-center"></i>
                                        中
                                    </button>
                                    <button class="btn btn-default" type="button">
                                        <i class="glyphicon glyphicon-align-right"></i>
                                        右
                                    </button>
                                    <button class="btn btn-default" type="button">
                                        <i class="glyphicon glyphicon-align-justify"></i>
                                        全
                                    </button>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="dropup">朝向</a>
                            </span>
                            <div class="preview">下拉菜单</div>
                            <div class="view">
                                <div class="btn-group col-md-12 column">
                                    <button class="btn btn-default" contenteditable="true">Action</button>
                                    <button data-toggle="dropdown" class="btn btn-default dropdown-toggle">
                                        <span class="caret"></span>
                                    </button>
                                    <ul class="dropdown-menu" contenteditable="true">
                                        <li>
                                            <a href="#">操作</a>
                                        </li>
                                        <li class="disabled">
                                            <a href="#">另一操作</a>
                                        </li>
                                        <li class="divider"></li>
                                        <li>
                                            <a href="#">其它</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="nav-tabs">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="nav-pills">线框</a>
                                        </li>
                                    </ul>
                                </span>
                                <a class="btn btn-xs btn-default" href="#" rel="nav-stacked">切换格式</a>
                            </span>
                            <div class="preview">导航</div>
                            <div class="view">
                                <ul class="nav nav-tabs" contenteditable="true">
                                    <li class="active">
                                        <a href="#">首页</a>
                                    </li>
                                    <li>
                                        <a href="#">简介</a>
                                    </li>
                                    <li class="disabled">
                                        <a href="#">信息</a>
                                    </li>
                                    <li class="dropdown pull-right">
                                        <a href="#" data-toggle="dropdown" class="dropdown-toggle">
                                            下拉 <b class="caret"></b>
                                        </a>
                                        <ul class="dropdown-menu">
                                            <li>
                                                <a href="#">操作</a>
                                            </li>
                                            <li>
                                                <a href="#">设置栏目</a>
                                            </li>
                                            <li>
                                                <a href="#">更多设置</a>
                                            </li>
                                            <li class="divider"></li>
                                            <li>
                                                <a href="#">分割线</a>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">路径导航</div>
                            <div class="view">

                                <ul class="breadcrumb">
                                    <li>
                                        <a href="#" contenteditable="true">Home</a>
                                    </li>
                                    <li>
                                        <a href="#" contenteditable="true">Library</a>
                                    </li>
                                    <li class="active" contenteditable="true">Data</li>
                                </ul>

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        尺寸
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="pagination-lg">大</a>
                                        </li>
                                        <li class="active">
                                            <a href="#" rel="">中</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="pagination-sm">小</a>
                                        </li>
                                    </ul>
                                </span>

                            </span>
                            <div class="preview">分页</div>
                            <div class="view">
                                <ul class="pagination" contenteditable="true">
                                    <li>
                                        <a href="#">Prev</a>
                                    </li>
                                    <li>
                                        <a href="#">1</a>
                                    </li>
                                    <li>
                                        <a href="#">2</a>
                                    </li>
                                    <li>
                                        <a href="#">3</a>
                                    </li>
                                    <li>
                                        <a href="#">4</a>
                                    </li>
                                    <li>
                                        <a href="#">5</a>
                                    </li>
                                    <li>
                                        <a href="#">Next</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="label-default">Default</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="label-primary">Primary</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="label-success">Success</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="label-info">Info</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="label-warning">Warning</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="label-danger">Danger</a>
                                        </li>
                                    </ul>
                                </span>
                            </span>
                            <div class="preview">标签</div>
                            <div class="view">
                                <span class="label label-default" contenteditable="true">标签</span>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">徽章</div>
                            <div class="view">
                                <ul class="nav nav-pills" contenteditable="true">
                                    <li class="active">
                                        <a href="#">
                                            <span class="badge pull-right">42</span>
                                            Home
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <span class="badge pull-right">16</span>
                                            More
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="well">Well</a>
                            </span>
                            <div class="preview">巨幕</div>
                            <div class="view">

                                <div class="jumbotron col-md-12 column" contenteditable="true">
                                    <h1>Hello, world!</h1>
                                    <p>
                                        This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.
                                    </p>
                                    <p>
                                        <a class="btn btn-primary btn-large" href="#">Learn more</a>
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">页头</div>
                            <div class="view">
                                <div class="page-header">
                                    <h1 contenteditable="true">
                                        Example page header
                                        <small>Subtext for header</small>
                                    </h1>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">文本</div>
                            <div class="view">
                                <h2 contenteditable="true">Heading</h2>
                                <p contenteditable="true">
                                    Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
                                </p>
                                <p>
                                    <a class="btn" href="#" contenteditable="true">View details &raquo;</a>
                                </p>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">缩略图</div>
                            <div class="view">
                                <div class="row col-md-12">
                                    <div class="col-md-4">
                                        <div class="thumbnail">
                                            <img alt="300x200" src="~/Content/img/a.jpg">
                                            <div class="caption" contenteditable="true">
                                                <h3>Thumbnail label</h3>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                                <p>
                                                    <a class="btn btn-primary" href="#">Action</a>
                                                    <a class="btn" href="#">Action</a>
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="thumbnail">
                                            <img alt="300x200" src="~/Content/img/a.jpg">
                                            <div class="caption" contenteditable="true">
                                                <h3>Thumbnail label</h3>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                                <p>
                                                    <a class="btn btn-primary" href="#">Action</a>
                                                    <a class="btn" href="#">Action</a>
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="thumbnail">
                                            <img alt="300x200" src="~/Content/img/a.jpg">
                                            <div class="caption" contenteditable="true">
                                                <h3>Thumbnail label</h3>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                                <p>
                                                    <a class="btn btn-primary" href="#">Action</a>
                                                    <a class="btn" href="#">Action</a>
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>

                            <span class="configuration  label label-default">

                                <a class="btn btn-xs btn-default" href="#" rel="progress-striped">条纹</a>
                                <a class="btn btn-xs btn-default" href="#" rel="active">动画</a>
                            </span>

                            <div class="preview">进度条</div>
                            <div class="view">
                                <div class="progress">
                                    <div class="progress-bar progress-success" style="width: 60%;"></div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <a class="btn btn-xs btn-default" href="#" rel="well">嵌入</a>
                            </span>
                            <div class="preview">媒体</div>
                            <div class="view">
                                <div class="media">
                                    <a href="#" class="pull-left">
                                        <img src="~/Content/img/a.jpg" class="media-object">
                                    </a>
                                    <div class="media-body" contenteditable="true">
                                        <h4 class="media-heading">Nested media heading</h4>
                                        Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
                                        <div class="media">
                                            <a href="#" class="pull-left">
                                                <img src="~/Content/img/a.jpg" class="media-object">
                                            </a>
                                            <div class="media-body" contenteditable="true">
                                                <h4 class="media-heading">Nested media heading</h4>
                                                Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">列表组</div>
                            <div class="view">
                                <div class="list-group" contenteditable="true">
                                    <a href="#" class="list-group-item active">Home</a>
                                    <div class="list-group-item">List header</div>
                                    <div class="list-group-item">
                                        <h4 class="list-group-item-heading">List group item heading</h4>
                                        <p class="list-group-item-text">...</p>
                                    </div>
                                    <div class="list-group-item">
                                        <span class="badge">14</span>
                                        Help
                                    </div>
                                    <a class="list-group-item active">
                                        <span class="badge">14</span>
                                        Help
                                    </a>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="panel-default">Default</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="panel-primary">Primary</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="panel-success">Success</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="panel-info">Info</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="panel-warning">Warning</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="panel-danger">Danger</a>
                                        </li>
                                    </ul>
                                </span>

                            </span>
                            <div class="preview">面板</div>
                            <div class="view">
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h3 class="panel-title" contenteditable="true">Panel title</h3>
                                    </div>
                                    <div class="panel-body" contenteditable="true">Panel content</div>
                                    <div class="panel-footer" contenteditable="true">Panel footer</div>
                                </div>
                            </div>
                        </div>

                    </li>
                </ul>

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">
                        <i class="glyphicon glyphicon-plus"></i>
                        JavaScript组件

                    </li>
                    <li class="boxes mute" id="elmJS">
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">遮罩窗体</div>
                            <div class="view">
                                <!-- Button to trigger modal -->
                                <a id="myModalLink" href="#myModalContainer" role="button" class="btn" data-toggle="modal">触发遮罩窗体</a>

                                <!-- Modal -->
                                <div class="modal fade" id="myModalContainer" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                                <h4 class="modal-title" id="myModalLabel" contenteditable="true">标题</h4>
                                            </div>
                                            <div class="modal-body" contenteditable="true">内容...</div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default" data-dismiss="modal" contenteditable="true">关闭</button>
                                                <button type="button" class="btn btn-primary" contenteditable="true">保存</button>
                                            </div>
                                        </div>
                                        <!-- /.modal-content -->
                                    </div>
                                    <!-- /.modal-dialog -->
                                </div>
                                <!-- /.modal -->

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        位置
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="navbar-static-top">头部</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="navbar-fixed-top">固定在头部</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="navbar-fixed-bottom">固定在底部</a>
                                        </li>
                                    </ul>
                                </span>
                                <a class="btn btn-xs btn-default" href="#" rel="navbar-inverse">反转</a>
                                <!--a class="btn btn-xs btn-default" href="#" rel="navbar-static-top">Static top</a>
                                <a class="btn btn-mini" href="#" rel="navbar-fixed-top">Navbar fixed top</a>
                                <a class="btn btn-mini" href="#" rel="navbar-fixed-bottom">Navbar fixed bottom</a-->
                            </span>
                            <div class="preview">导航栏</div>
                            <div class="view">

                                <nav class="navbar navbar-default" role="navigation">
                                    <!-- Brand and toggle get grouped for better mobile display -->
                                    <div class="navbar-header">
                                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                                            <span class="sr-only">Toggle navigation</span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                        </button>
                                        <a class="navbar-brand" href="#">Brand</a>
                                    </div>

                                    <!-- Collect the nav links, forms, and other content for toggling -->
                                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                                        <ul class="nav navbar-nav">
                                            <li class="active">
                                                <a href="#">Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Link</a>
                                            </li>
                                            <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                                    Dropdown <b class="caret"></b>
                                                </a>
                                                <ul class="dropdown-menu">
                                                    <li>
                                                        <a href="#">Action</a>
                                                    </li>
                                                    <li>
                                                        <a href="#">Another action</a>
                                                    </li>
                                                    <li>
                                                        <a href="#">Something else here</a>
                                                    </li>
                                                    <li class="divider"></li>
                                                    <li>
                                                        <a href="#">Separated link</a>
                                                    </li>
                                                    <li class="divider"></li>
                                                    <li>
                                                        <a href="#">One more separated link</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                        <form class="navbar-form navbar-left" role="search">
                                            <div class="form-group">
                                                <input type="text" class="form-control" placeholder="Search">
                                            </div>
                                            <button type="submit" class="btn btn-default">Submit</button>
                                        </form>
                                        <ul class="nav navbar-nav navbar-right">
                                            <li>
                                                <a href="#">Link</a>
                                            </li>
                                            <li class="dropdown">
                                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                                    Dropdown
                                                    <b class="caret"></b>
                                                </a>
                                                <ul class="dropdown-menu">
                                                    <li>
                                                        <a href="#">Action</a>
                                                    </li>
                                                    <li>
                                                        <a href="#">Another action</a>
                                                    </li>
                                                    <li>
                                                        <a href="#">Something else here</a>
                                                    </li>
                                                    <li class="divider"></li>
                                                    <li>
                                                        <a href="#">Separated link</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </div>
                                    <!-- /.navbar-collapse -->
                                </nav>

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">选项卡</div>
                            <div class="view">
                                <div class="tabbable" id="myTabs">
                                    <!-- Only required for left/right tabs -->
                                    <ul class="nav nav-tabs">
                                        <li class="active">
                                            <a href="#tab1" data-toggle="tab" contenteditable="true">Section 1</a>
                                        </li>
                                        <li>
                                            <a href="#tab2" data-toggle="tab" contenteditable="true">Section 2</a>
                                        </li>
                                    </ul>
                                    <div class="tab-content">
                                        <div class="tab-pane active" id="tab1">
                                            <p contenteditable="true">I'm in Section 1.</p>
                                        </div>
                                        <div class="tab-pane" id="tab2">
                                            <p contenteditable="true">Howdy, I'm in Section 2.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="alert-success">Success</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="alert-info">Info</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="alert-warning">Warning</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="alert-danger">Danger</a>
                                        </li>
                                    </ul>
                                </span>

                            </span>
                            <div class="preview">提示框</div>
                            <div class="view">
                                <div class="alert alert-success alert-dismissable" contenteditable="true">
                                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                                    <h4>注意!</h4>
                                    <strong>Warning!</strong>
                                    Best check yo self, you're not looking too good.
                                    <a href="#" class="alert-link">alert link</a>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">手风琴切换</div>
                            <div class="view">
                                <div class="panel-group" id="myAccordion">
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <a class="panel-title" data-toggle="collapse" data-parent="#myAccordion" href="#collapseOne" contenteditable="true">Collapsible Group Item #1</a>
                                        </div>
                                        <div id="collapseOne" class="panel-collapse collapse in">
                                            <div class="col-md-12 column">
                                                <div class="panel-body " contenteditable="true">Anim pariatur cliche...</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="panel panel-default">
                                        <div class="panel-heading">
                                            <a class="panel-title" data-toggle="collapse" data-parent="#myAccordion" href="#collapseTwo" contenteditable="true">Collapsible Group Item #2</a>
                                        </div>
                                        <div id="collapseTwo" class="panel-collapse collapse">
                                            <div class="col-md-12 column">
                                                <div class="panel-body " contenteditable="true">Anim pariatur cliche2...</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <div class="preview">幻灯片</div>
                            <div class="view">

                                <div class="carousel slide" id="myCarousel">
                                    <ol class="carousel-indicators">
                                        <li class="active" data-slide-to="0" data-target="#myCarousel"></li>
                                        <li data-slide-to="1" data-target="#myCarousel" class=""></li>
                                        <li data-slide-to="2" data-target="#myCarousel" class=""></li>
                                    </ol>
                                    <div class="carousel-inner">
                                        <div class="item active">
                                            <img alt="" src="~/Content/img/a.jpg">
                                            <div class="carousel-caption">
                                                <h4>First Thumbnail label</h4>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <img alt="" src="~/Content/img/a.jpg">
                                            <div class="carousel-caption">
                                                <h4>Second Thumbnail label</h4>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                            </div>
                                        </div>
                                        <div class="item">
                                            <img alt="" src="~/Content/img/a.jpg">
                                            <div class="carousel-caption">
                                                <h4>Third Thumbnail label</h4>
                                                <p>
                                                    Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
                                                </p>
                                            </div>
                                        </div>
                                    </div>

                                    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                                        <span class="glyphicon glyphicon-chevron-left"></span>
                                    </a>
                                    <a class="right carousel-control" href="#myCarousel" data-slide="next">
                                        <span class="glyphicon glyphicon-chevron-right"></span>
                                    </a>
                                </div>

                            </div>
                        </div>
                    </li>
                </ul>
                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">

                        <i class="glyphicon-plus glyphicon"></i>
                        UI表单
                    </li>
                    <li class="rows" id="estRows">

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a> </span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">水平表单域</div>
                            <div class="view">
                                <div role="form" class="form-horizontal col-md-12 column">

                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#inputTextFormModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">输入框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label for="firstname" class="col-sm-2 control-label" contenteditable="true">标题</label>
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" propertyeditable="true"
                                               placeholder="请输入名字" />
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#inputTextFormModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">密码框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label" contenteditable="true">密码</label>
                                    <div class="col-sm-10">
                                        <input type="password" class="form-control" propertyeditable="true"
                                               placeholder="请输入密码">
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#textareaFormModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">多行文本框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label" contenteditable="true">标题</label>
                                    <div class="col-sm-10">
                                        <textarea class="form-control" rows="10" propertyeditable="true"></textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#inputRadioCheckBoxFormModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">复选框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label" contenteditable="true">标题</label>
                                    <div class="col-sm-10">
                                        <div class="checkbox">
                                            <label propertyeditable="true">
                                                <input type="checkbox">复选框
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>

                                    <a class="btn btn-default" data-target="#inputRadioCheckBoxFormModal" role="button" data-toggle="modal">属性</a>
                                </span>
                            </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">单选框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label" contenteditable="true">标题</label>
                                    <div class="col-sm-10">
                                        <div class="radio">
                                            <label propertyeditable="true">
                                                <input type="radio">单选框
                                            </label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">静态下拉选择框</div>
                            <div class="view">
                                <div class="form-group">

                                    <label class="col-sm-2 control-label">标题</label>
                                    <div class="col-sm-10">
                                        <select class="form-control">

                                            <option value="1">北京</option>
                                            <option value="2">上海</option>
                                            <option value="3">天津</option>

                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#dynamicselectModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">动态下拉选择框</div>
                            <div class="view">
                                <div class="form-group">

                                    <label class="col-sm-2 control-label">标题</label>
                                    <div class="col-sm-10">
                                        <select id="dyselect" class="form-control" data-filter="dynamicselect" propertyeditable="true">
                                            <option value="1">请配置数据源</option>
                                        </select>
                                        <script type="application/json" selectjson='true'>
                                            {
                                                "ELE_ID":"",
                                                "SELECT_SQL": "",
                                                "DATASOURCE":"",
                                                "SELECT_VALUE_RECORD":"",
                                                "SELECT_TEXT_RECORD":""

                                            }
                                        </script>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">静态列表选择框</div>
                            <div class="view">
                                <div class="form-group">

                                    <label class="col-sm-2 control-label">标题</label>
                                    <div class="col-sm-10">
                                        <select multiple class="form-control ">

                                            <option value="1">北京</option>
                                            <option value="2">上海</option>
                                            <option value="3">天津</option>

                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#dynamicselectModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">动态列表选择框</div>
                            <div class="view">
                                <div class="form-group">

                                    <label class="col-sm-2 control-label">标题</label>
                                    <div class="col-sm-10">
                                        <script type="application/json" selectjson='true'>
                                            {
                                                "ELE_ID":"",
                                                "SELECT_SQL": "",
                                                "DATASOURCE":"",
                                                "SELECT_VALUE_RECORD":"",
                                                "SELECT_TEXT_RECORD":""

                                            }
                                        </script>
                                        <select id="dyselect" multiple class="form-control " data-filter="dynamicselect" propertyeditable="true">

                                            <option value="1">北京</option>
                                            <option value="2">上海</option>
                                            <option value="3">天津</option>

                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>

                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>

                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>
                                </span>
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-primary">原生</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-info">信息</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-success">成功</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-warning">提醒</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-danger">危险</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-inverse">反转</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-link">链接</a>
                                        </li>
                                    </ul>
                                </span>
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        尺寸
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="">
                                            <a href="#" rel="btn-lg">大</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-default">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-sm">小</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="btn-xs">微型</a>
                                        </li>
                                    </ul>
                                </span>

                                <a class="btn btn-xs btn-default" href="#" rel="btn-block">通栏</a>
                                <a class="btn btn-xs btn-default" href="#" rel="active">活动</a>
                                <a class="btn btn-xs btn-default" href="#" rel="disabled">禁用</a>
                            </span>
                            <div class="preview">按钮</div>
                            <div class="view">

                                <button type="button" class="btn btn-default" contenteditable="true">按钮</button>


                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>


                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">

                                    <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>
                                    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a>
                                    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
                                        样式
                                        <span class="caret"></span>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li class="active">
                                            <a href="#" rel="">默认</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="table-striped">条纹</a>
                                        </li>
                                        <li class="">
                                            <a href="#" rel="table-bordered">边框</a>
                                        </li>
                                    </ul>
                                </span>
                                <a class="btn btn-xs btn-default" href="#" rel="table-hover">鼠标指示</a>
                                <a class="btn btn-xs btn-default" href="#" rel="table-condensed">紧凑</a>
                            </span>
                            <div class="preview">表格</div>
                            <div class="view">
                                <table class="table" contenteditable="true">
                                    <thead>
                                        <tr>
                                            <th><div class="col-md-12 column">编号</div></th>
                                            <th><div class="col-md-12 column">产品</div></th>
                                            <th><div class="col-md-12 column">交付时间</div></th>
                                            <th><div class="col-md-12 column">状态</div></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><div class="col-md-12 column">1</div> </td>
                                            <td><div class="col-md-12 column">TB - Monthly</div> </td>
                                            <td><div class="col-md-12 column">01/04/2012</div> </td>
                                            <td><div class="col-md-12 column">Default</div></td>
                                        </tr>
                                        <tr class="success">
                                            <td><div class="col-md-12 column">1</div> </td>
                                            <td><div class="col-md-12 column">TB - Monthly</div> </td>
                                            <td><div class="col-md-12 column">01/04/2012</div> </td>
                                            <td><div class="col-md-12 column">Default</div></td>
                                        </tr>
                                        <tr class="error">
                                            <td><div class="col-md-12 column">1</div> </td>
                                            <td><div class="col-md-12 column">TB - Monthly</div> </td>
                                            <td><div class="col-md-12 column">01/04/2012</div> </td>
                                            <td><div class="col-md-12 column">Default</div></td>
                                        </tr>
                                        <tr class="warning">
                                            <td><div class="col-md-12 column">1</div> </td>
                                            <td><div class="col-md-12 column">TB - Monthly</div> </td>
                                            <td><div class="col-md-12 column">01/04/2012</div> </td>
                                            <td><div class="col-md-12 column">Default</div></td>
                                        </tr>
                                        <tr class="info">
                                            <td><div class="col-md-12 column">1</div> </td>
                                            <td><div class="col-md-12 column">TB - Monthly</div> </td>
                                            <td><div class="col-md-12 column">01/04/2012</div> </td>
                                            <td><div class="col-md-12 column">Default</div></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">下拉按钮</div>
                            <div class="view">
                                <div class="dropdown">
                                    <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">
                                        主题
                                        <span class="caret"></span>
                                    </button>
                                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                                        <li role="presentation">
                                            <a role="menuitem" tabindex="-1" href="#">Java</a>
                                        </li>
                                        <li role="presentation">
                                            <a role="menuitem" tabindex="-1" href="#">数据挖掘</a>
                                        </li>
                                        <li role="presentation">
                                            <a role="menuitem" tabindex="-1" href="#">数据通信/网络</a>
                                        </li>
                                        <li role="presentation" class="divider"></li>
                                        <li role="presentation">
                                            <a role="menuitem" tabindex="-1" href="#">分离的链接</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">日期选择框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label for="dtp_input1" class="col-md-2 control-label">日期</label>
                                    <div class="input-group date form_date col-md-5" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd" data-link-field="dtp_input1">
                                        <input class="form-control" size="16" type="text" value="" readonly>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                    </div>
                                    <input type="hidden" id="dtp_input1" value="" /><br />
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">日期时间选择框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label for="dtp_input1" class="col-md-2 control-label">日期时间</label>
                                    <div class="input-group date form_datetime col-md-5" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd HH:mm ss" data-link-field="dtp_input1">
                                        <input class="form-control" size="16" type="text" value="" readonly>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                    </div>
                                    <input type="hidden" id="dtp_input1" value="" /><br />
                                </div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">   <a class="btn btn-default" data-target="#editorModal" role="button" data-toggle="modal">编辑</a>  <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">时间选择框</div>
                            <div class="view">
                                <div class="form-group">
                                    <label for="dtp_input3" class="col-md-2 control-label">Time Picking</label>
                                    <div class="input-group date form_time col-md-5" data-date="" data-date-format="hh:mm:ss" data-link-field="dtp_input3" data-link-format="hh:ii">
                                        <input class="form-control" size="16" type="text" value="" readonly>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                                        <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span></span>
                                    </div>
                                    <input type="hidden" id="dtp_input3" value="" /><br />
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">

                        <i class="glyphicon-plus glyphicon"></i>
                        图表&动态表格
                    </li>
                    <li class="rows" id="estRows">
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">
                                <span class="btn-group btn-group-xs">
                                    <a class="btn btn-default" data-target="#DynamicTableModal" role="button" data-toggle="modal">属性</a>
                                </span>
                            </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">动态表格</div>
                            <div class="view">
                                <div id="toolbar" data-filter="dynamictable_toolbar">

                                </div>
                                <script type="application/json" tablejson="true">
                                    {
                                      "DATASOURCE": "",
                                      "TABLE_KEY_ID_RECORD": "",
                                      "TABLE_HEIGHT": 500,
                                      "TABLE_TITLE": "动态表格标题",
                                      "ELE_ID": "",
                                       "BUTTON_ID":"",
                                      "TABLE_SHOW_PAGE": true,
                                      "TABLE_SHOW_TOOL": true,
                                      "TABLE_PAGESIZE": 100,
                                      "TABLE_SQL": "",
                                      "TABLE_COLIMNS":[],
                                      "FILTER_SELECT1_CHANGE_SELECT2": false,
                                      "FILTER_ENABLE": true,
                                      "FILTER_SELECT1": {
                                      "ELE_ID":"",
                                      "SELECT_ENABLE":true,
                                      "SELECT_SQL":"",
                                      "SELECT_VALUE_RECORD":"",
                                      "SELECT_TEXT_RECORD":"",
                                      "SELECT_TABLE_RECORD":"",
                                       "DATASOURCE": ""
                                        },
                                      "FILTER_SELECT2": {
                                        "ELE_ID":"",
                                      "SELECT_ENABLE":true,
                                      "SELECT_SQL":"",
                                      "SELECT_VALUE_RECORD":"",
                                      "SELECT_TEXT_RECORD":"",
                                      "SELECT_TABLE_RECORD":"",
                                      "DATASOURCE": ""
                                        },
                                       "FILTER_KEY": {
                                      "ELE_ID":"",
                                      "TEXT_ENABLE":true,
                                      "TABLE_RECORD":""
                                        },
                                      "FILTER_DATE_RANGE": {
                                      "ELE_ID":"",
                                      "ELE2_ID":"",
                                      "TEXT_ENABLE":true,
                                      "TABLE_RECORD":""
                                        }


                                    }
                                </script>

                                <div style="text-align:left;" data-filter="searchbar" class="row">
                                    <div class="col-md-2 form-group" data-filter="select1">
                                        <select class="form-control"><option value="">请选择分类</option></select>
                                    </div>
                                    <div class="col-md-2 form-group" data-filter="select2">
                                        <select class="form-control"><option value="">请选择分类</option></select>
                                    </div>
                                    <div class="col-md-2 form-group" data-filter="key">
                                        <input type="text" placeholder="请输入查询关键字" class="form-control" />
                                    </div>
                                    <div class="col-md-2" data-filter="daterange">
                                        <div class="form-group">

                                            <div class="input-group date form_date" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd" data-link-field="dtp_input1">
                                                <input class="form-control" size="16" type="text" value="" readonly data-filter="date1">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                            </div>
                                            <input type="hidden" id="dtp_input1" value="" />
                                        </div>
                                    </div>
                                    <div class="col-md-2" data-filter="daterange">
                                        <div class="form-group">

                                            <div class="input-group date form_date" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd" data-link-field="dtp_input1">
                                                <input class="form-control" size="16" type="text" value="" readonly data-filter="date2">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                            </div>
                                            <input type="hidden" id="dtp_input1" value="" />
                                        </div>
                                    </div>
                                    <div class="col-md-2">
                                        <div class="form-group" " data-filter="searchbutton">
                                            <button type="button" class=" btn btn-success" title="查询">查询</button>
                                        </div>
                                    </div>
                                </div>
                                <div style="text-align:center; font-size:30px; font-weight:bold;" data-filter="tabletitle" class="row"> 动态表格标题 </div>

                                <table id="dytable" data-filter="dynamictable" propertyeditable="true"
                                       data-toolbar="#toolbar"
                                       data-search="false"
                                       data-show-refresh="true"
                                       data-show-toggle="true"
                                       data-show-fullscreen="true"
                                       data-show-columns="true"
                                       data-show-columns-toggle-all="true"
                                       data-detail-view="true"
                                       data-show-export="true"
                                       data-click-to-select="true"
                                       data-detail-formatter="detailFormatter"
                                       data-minimum-count-columns="2"
                                       data-show-pagination-switch="true"
                                       data-pagination="true"
                                       data-id-field="id"
                                       data-page-list="[10, 25, 50, 100, all]"
                                       data-show-footer="true"
                                       data-side-pagination="server"
                                       data-url="/Scada/WebPage/TableData"
                                       data-response-handler="responseHandler">
                                </table>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#DynamicChartProperties" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">曲线/柱/散点/饼/面积/堆积图</div>
                            <div class="view">
                                <script type="application/json"></script>
                                <div style="text-align:left;" data-filter="searchbar" class="row">
                                    <div class="col-md-2 form-group" data-filter="select1">
                                        <select class="form-control"><option value="">请选择分类</option></select>
                                    </div>
                                    <div class="col-md-2 form-group" data-filter="select2">
                                        <select class="form-control"><option value="">请选择分类</option></select>
                                    </div>
                                    <div class="col-md-2 form-group" data-filter="key">
                                        <input type="text" placeholder="请输入查询关键字" class="form-control" />
                                    </div>
                                    <div class="col-md-2" data-filter="daterange">
                                        <div class="form-group">

                                            <div class="input-group date form_date" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd" data-link-field="dtp_input1">
                                                <input class="form-control" size="16" type="text" value="" readonly data-filter="date1">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                            </div>
                                            <input type="hidden" id="dtp_input1" value="" />
                                        </div>
                                    </div>
                                    <div class="col-md-2" data-filter="daterange">
                                        <div class="form-group">

                                            <div class="input-group date form_date" data-date="1979-09-16T05:25:07Z" data-date-format="yyyy-MM-dd" data-link-field="dtp_input1">
                                                <input class="form-control" size="16" type="text" value="" readonly data-filter="date2">
                                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                                            </div>
                                            <input type="hidden" id="dtp_input1" value="" />
                                        </div>
                                    </div>
                                    <div class="col-md-2">
                                        <div class="form-group" " data-filter="searchbutton">
                                            <button type="button" class=" btn btn-success" title="查询">查询</button>
                                        </div>
                                    </div>
                                </div>
                                <div id="seriecontainer" class="row" style="height: 100%" data-filter="EChart" data-serietype="line"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">雷达图</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">热力图</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">基础仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">速度仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">进度仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">阶段速度仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">等级仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">多标题仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">气温仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">得分环</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">气压表</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">时钟仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">时钟仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">

                        <i class="glyphicon-plus glyphicon"></i>
                        物联网组件
                    </li>
                    <li class="rows" id="estRows">
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IORealLabelProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO实时值标签</div>
                            <div class="view">
                                <label data-iofilter="ioreallabel" data-io="">0.0001</label>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IOPercentProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO百分比值标签</div>
                            <div class="view">
                                <label data-iofilter="iopercentlabel" data-io="">0.00%</label>
                            </div>
                        </div>


                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IODateTimeProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO采集日期标签</div>
                            <div class="view">
                                <label data-iofilter="iodatetimelabel" data-io="" data-date-format="yyyy-MM-dd HH:mm ss" style="color:red;">1970-01-01 01:01::01</label>
                            </div>
                        </div>


                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IOStatusBlockProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO方形状态块</div>
                            <div class="view">
                                <label data-iofilter="iostatusblocklabel" data-io="" style="width: 20px; height: 20px; background-color: brown; position: absolute; "></label>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IOStatusCircleProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO圆形状态块</div>
                            <div class="view">
                                <label data-iofilter="iostatuscirclelabel" data-io="" style="width: 20px; height: 20px; background-color: brown; position: absolute; border-radius: 50%; "></label>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IOPercentProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO图标状态块</div>
                            <div class="view">
                                <label data-iofilter="iostatusiconlabel" data-io="" style="width: 20px; height: 20px; background-color: brown; position: absolute; "></label>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#IOPercentProperities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO文本状态块</div>
                            <div class="view">
                                <label data-iofilter="iostatusiconlabel" data-io="" style="width: 20px; height: 20px; background-color: brown; position: absolute; "></label>
                            </div>
                        </div>


                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO实时曲线图</div>
                            <div class="view">
                                <label></label>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#DynamicTableModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史表</div>
                            <div class="view">

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#DynamicTableModal" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史统计表</div>
                            <div class="view">

                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史曲线图</div>
                            <div class="view">
                                <label></label>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史统计曲线图</div>
                            <div class="view">
                                <label></label>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO实时曲线图</div>
                            <div class="view">
                                <label></label>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO进度仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO基础仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO等级仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO气压表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO时钟仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO阶段速度仪表盘</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO综合组件</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>

                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史查询表</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史事件查询表</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO机器预测历史查询</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO机器预测组合显示</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO实时报警表</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                        <div class="box box-element">
                            <a href="#close" class="remove label label-danger">
                                <i class="glyphicon glyphicon-remove"></i>
                                删除
                            </a>
                            <span class="configuration  label label-default">  <span class="btn-group btn-group-xs">    <a class="btn btn-default" data-target="#Properities" role="button" data-toggle="modal">属性</a></span>  </span>
                            <span class="drag label label-default">
                                <i class=" "></i>
                                拖动
                            </span>
                            <span class="configuration  label label-default"></span>
                            <div class="preview">IO历史报警表</div>
                            <div class="view">
                                <div id="container" style="height: 100%" data-filter="EChart" data-serietype="pie"></div>
                            </div>
                        </div>
                    </li>
                </ul>
                <ul class="nav nav-list accordion-group">
                    <li class="nav-header">

                        <i class="glyphicon-plus glyphicon"></i>
                        流程图图件
                    </li>
                    <li class="rows" id="estRows">


                    </li>
                </ul>

            </div>
        </div>
    </div>
    <div class="demo">


    </div>
    <div id="download-layout">
        <div class="container"></div>
    </div>
</div>

<input type="hidden" id="PageId" value="0" />
<input type="hidden" id="PageUid" value="" />
<!--/.fluid-container-->
<!--通用的属性编辑器-->
@Html.Partial("InputTextFormPropertiesEdit")
@Html.Partial("TextAreaFormPropertiesEdit")
@Html.Partial("InputRadioCheckBoxPropertiesEdit")
@Html.Partial("DynamicTablePropertiesEdit", Model)
@Html.Partial("DynamicSelectPropertiesEdit", Model)
@Html.Partial("DynamicChartPropertiesEdit", Model)



